<template>
  <ToolbarButton
    icon="i-mdi-undo"
    title="撤销"
    shortcut="Ctrl+Z"
    :disabled="!canUndo"
    @click="handleClick"
  />
</template>

<script setup lang="ts">
import { computed, inject, type Ref } from 'vue'
import type { Editor } from '@tiptap/vue-3'
import ToolbarButton from "../../../button/index.vue";

defineOptions({
  name: 'Undo'
})

// 注入编辑器实例
const editor = inject<Ref<Editor>>('editor')

const canUndo = computed(() => {
  return editor?.value?.can().undo() ?? false
})

const handleClick = () => {
  editor?.value?.chain().focus().undo().run()
}
</script>
